<template class="my-top" xmlns:el-col="http://www.w3.org/1999/html">
  <div class="main-impt">

    <el-container style="height: 100%" direction="vertical">

<!--头部-->
      <el-header>
        <el-row class="top-row">
          <div>
            <el-col class="top-img">
            </el-col>
          </div>
          <el-col class="top-2">
            <el-row class="top-2-2">
              <el-col class="search-img" :span="3"></el-col>
              <el-col :span="13">
                <input type="text" value="请输入关键词" style="background-color:rgb(102,102,102);line-height:28px;border: none;color: rgb(190,190,190);font-size: 14px">
              </el-col>
              <el-col :span="4">
                   <div class="my-menu-down">
                     <el-dropdown>
                    <span class="el-dropdown-link">
                      全部<i class=" el-icon--right el-icon-caret-bottom"></i>
                    </span>
                       <el-dropdown-menu slot="dropdown" class="my-menu">
                         <el-dropdown-item class="menu-title">知网书</el-dropdown-item>
                         <el-dropdown-item class="menu-title">文章</el-dropdown-item>
                         <el-dropdown-item class="menu-title">编客</el-dropdown-item>
                         <el-dropdown-item class="menu-title">专题</el-dropdown-item>
                         <el-dropdown-item class="menu-title">讲座</el-dropdown-item>
                       </el-dropdown-menu>
                     </el-dropdown>
                   </div>
              </el-col>
              <el-col :span="4" class="search-kung">
                <span>
                  搜 索
                </span>
              </el-col>
            </el-row>
          </el-col>
          <el-col class="top-nav">
            <el-menu mode="horizontal" class="top-nav-2">
              <el-menu-item index="1" background-color="#545c64" class="my-menu-it" >登录</el-menu-item>
             <span>|</span>
<!--              <el-menu-item index="1" disabled></el-menu-item>-->
              <el-menu-item index="1">注册</el-menu-item>

              <el-submenu index="2" class="tow-item">
                <template slot="title">个人中心</template>
                <el-menu-item index="2-1" class="tow-item">我的书架</el-menu-item>
                <el-menu-item index="2-2" class="tow-item">账单管理</el-menu-item>
                <el-menu-item index="2-2" class="tow-item">----------</el-menu-item>
                <el-menu-item index="2-3" class="tow-item">个人资料</el-menu-item>
                <el-menu-item index="2-3" class="tow-item">我关注的</el-menu-item>
              </el-submenu>

              <el-menu-item index="3" >购物车</el-menu-item>

              <el-menu-item index="3" >充值</el-menu-item>

              <el-menu-item index="3" >帮助</el-menu-item>
<!--              <el-menu-item index="4"><a href="https://www.ele.me" target="_blank">订单管理</a></el-menu-item>-->
            </el-menu>
          </el-col>
        </el-row>
      </el-header>


<!--轮播图-->
        <template>
          <div class="block">
            <el-carousel height="450px" width="1000px">
              <el-carousel-item v-for="item in img" :key="item">
                <img :src="item" class="zou">
              </el-carousel-item>
            </el-carousel>
          </div>
        </template>

<!--主要区域-->
      <el-main class="e-m-2">
        <div>
          <h3>丰富的讲座形式</h3>
          <span>图文、音频、视频、PPT...精彩纷呈</span>
        </div>
        <div class="e-m-22">
          <el-row :gutter="20" class="e-m-2-2">
            <el-col :span="6" class="e-m-2-2-col">
              <div class="e-m2-div">
                <div class="e-m2-div-1">
                  <img src="https://bianke.cnki.net/resources/images/dachengForum/dcjt_icon1.png" alt="">
                  <span>
                    <em>
                       图文讲座
                    </em>
                  </span>
                </div>
                <div class="e-m2-div-2">
                  <span>
                      <em>
                        编写图文讲座
                      </em>
                  </span>
                  <p>
                    图文讲座以文字和图片为主要内容，可辅助插入音频、视频等多媒体内容，使讲座丰富多彩
                  </p>
                </div>
              </div>
            </el-col>

            <el-col :span="6" class="e-m-2-2-col">
              <div class="e-m2-div content-2">
                <div class="e-m2-div-1">
                  <img src="https://bianke.cnki.net/resources/images/dachengForum/dcjt_icon2.png" alt="">
                  <span>
                    <em>
                       音频讲座
                    </em>
                  </span>
                </div>
                <div class="e-m2-div-2">
                  <span>
                      <em>
                        发布音频讲座
                      </em>
                  </span>
                  <p>
                    音频讲座以音频为主要内容，可在摘要处辅助插入图文，使讲座内容更加充实完整
                  </p>
                </div>
              </div>
            </el-col>
            <el-col :span="6" class="e-m-2-2-col">
              <div class="e-m2-div content-3">
                <div class="e-m2-div-1">
                  <img src="https://bianke.cnki.net/resources/images/dachengForum/dcjt_icon3.png" alt="">
                  <span>
                    <em>
                       视频讲座
                    </em>
                  </span>
                </div>
                <div class="e-m2-div-2">
                  <span>
                      <em>
                        发布视频讲座
                      </em>
                  </span>
                  <p>
                    视频讲座以视频为主要内容，可在摘要处辅助插入图文，使讲座内容更加充实完整
                  </p>
                </div>
              </div>
            </el-col>
            <el-col :span="6" class="e-m-2-2-col">
              <div class="e-m2-div content-4">
                <div class="e-m2-div-1">
                  <img src="https://bianke.cnki.net/resources/images/dachengForum/dcjt_icon4.png" alt="">
                  <span>
                    <em>
                        PTT讲座
                    </em>
                  </span>
                </div>
                <div class="e-m2-div-2">
                  <span>
                      <em>
                        发布PTT讲座
                      </em>
                  </span>
                  <p>
                    PPT讲座以演示文稿的形式，可将图片、文字、音频、视频等内容融会贯通，更完整表达讲座内容
                  </p>
                </div>
              </div>
            </el-col>

          </el-row>
        </div>
      </el-main>
      <el-main class="e-m-3">
        <div>
          <el-row class="e-m-row">
            <div>
              <el-col :span="12" class="e-m-img">

                <img src="../assets/dcjt_bg2.jpg" alt="">

              </el-col>
            </div>

            <el-col :span="12" class="e-m-text">
              <h1>

                精彩的才学展示舞台
              </h1>
              <p>
                专家、学者、教师、医生、艺术家...不论是草根还是大咖，我们不问出身，只要你有才，我们就给你舞台，任你展现无限精彩！
              </p>

            </el-col>
          </el-row>
        </div>

      </el-main>
      <el-main class="e-m-4">
        <div>
          <el-row class="e-m-row">


              <el-col :span="12" class="e-m-text">
                <div class="e-m-h1">


                <h1 >
                  多样的讲座应用场景
                </h1>
                <p>
                  课堂实录、习题讲解、专题讲座、经典诵读、作品讲评......

                  有料你就讲出来！
                </p>
                </div>
              </el-col>


            <div>
              <el-col :span="12" class="e-m-img">

                <img src="../assets/dcjt_bg3.jpg" alt="">

              </el-col>
            </div>


          </el-row>
        </div>
      </el-main>
      <el-main class="e-m-5">

          <el-row>

              <el-col :span="12">
                <div>
                  <h1>便捷的讲座发布系统</h1>
                  <p>
                    智能便捷的讲座发布系统，三步让你轻松有料你就讲出来！
                  </p>
                </div>
              </el-col>
              <el-col :span="12">
                <div>
                  <img src="../assets/dcjt_bg4.jpg" alt="">
                </div>
              </el-col>

          </el-row>

      </el-main>
      <el-main class="e-m-6">
        <el-row>
          <el-col :span="12">
            <div>
              <img src="../assets/dcjt_bg5.jpg" alt="">
            </div>
          </el-col>
          <el-col :span="12">
            <div>
              <h1>
                智慧创造财富的平台
              </h1>
              <p>
                您的内容被读者订阅，可直接参与销售受益分成！

                真正享受授知识、智慧创造财富的乐趣！
              </p>
            </div>
          </el-col>
        </el-row>
      </el-main>
      <el-main class="e-m-7">
        <span class="e-m-7-text">精品讲座</span>
        <el-row :gutter="0" class="e-m-7-row">
          <el-col :span="6">
            <div class="m7-di1">
              <span>视频讲座</span>
              <img src="https://bianke.cnki.net/resources/imagesTemp/dachengForum/b1.jpg" alt="" >
              <h4>书法欣赏入门</h4>
              <p>李小燕</p>
            </div>
          </el-col>
          <el-col :span="6">
            <div class="m7-di1">
              <span>音频讲座</span>
              <img src="https://bianke.cnki.net/resources/imagesTemp/dachengForum/b2.jpg" alt="" width="281px" height="210">
              <h4>再别康桥</h4>
              <p>喵喵</p>
            </div>
          </el-col>
          <el-col :span="6">
            <div class="m7-di1">
              <span>视频讲座</span>
              <img src="https://bianke.cnki.net/resources/imagesTemp/dachengForum/b3.jpg" alt="" width="281px" height="210">
              <h4>书法欣赏入门</h4>
              <p>李小燕</p>
            </div>
          </el-col>
          <el-col :span="6">
            <div class="m7-di1">
              <span>视频讲座</span>
              <img src="https://bianke.cnki.net/resources/imagesTemp/dachengForum/b4.jpg" alt="" width="281px" height="210">
              <h4>书法欣赏入门</h4>
              <p>李小燕</p>
            </div>
          </el-col>
        </el-row>
        <el-row :gutter="0" class="e-m-7-row2">
          <el-col :span="6">
            <div class="m7-di1">
              <span>音频讲座</span>
              <img src="https://bianke.cnki.net/resources/imagesTemp/dachengForum/b5.jpg" alt="" width="281px" height="210">

              <h4>书法欣赏入门</h4>
              <p>李小燕</p>
            </div>
          </el-col>
          <el-col :span="6">
            <div class="m7-di1">
              <span>图文讲座</span>
              <img src="https://bianke.cnki.net/resources/imagesTemp/dachengForum/b6.jpg" alt="" width="281px" height="210">
              <h4>初中阶段</h4>
              <p>完强</p>
            </div>
          </el-col>
          <el-col :span="6">
            <div class="m7-di1">
              <span>图文讲座</span>
              <img src="https://bianke.cnki.net/resources/imagesTemp/dachengForum/b7.jpg" alt="" width="281px" height="210">
              <h4>中学生涯</h4>
              <p>吕常荣</p>
            </div>
          </el-col>
          <el-col :span="6">
            <div class="m7-di1">
              <span>视频讲座</span>
              <img src="https://bianke.cnki.net/resources/imagesTemp/dachengForum/b8.jpg" alt="" width="281px" height="210">
              <h4>书法欣赏入门</h4>
              <p>李小燕</p>
            </div>
          </el-col>
        </el-row>
        <span class="e-m-7-text2">发布讲座</span>
      </el-main>


<!--页脚-->
      <el-footer >
        <div class="footer">
        <el-row class="footer-row" >
          <el-col :span="4">
            <div class="footer-di1">
              <span>新手上路</span>


              <p>注册会员账号&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;如何为账户充值</p>

              <p>如何查找知网书&nbsp;&nbsp;如何购买知网书</p>

              <p>如何阅读知网书&nbsp;&nbsp;下载阅读器</p>

            </div>
          </el-col>
          <el-col :span="4">
            <div class="footer-di1">
              <span>支付方式</span>


              <p>银联在线 &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;支付宝</p>

              <p>会员卡&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;更多支付方式</p>

              <p>发票索取>></p>

            </div>
          </el-col>
          <el-col :span="4">
            <div class="footer-di1">
              <span>认证专区</span>


              <p>主编认证  &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;主编特权</p>



            </div>
          </el-col>
          <el-col :span="4">
            <div class="footer-di1">
              <span>关于我们</span>


              <p>关于大成编客 &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;联系我们</p>

              <p>友情连接 &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;网站声明</p>


            </div>
          </el-col>
          <el-col :span="4">
            <div class="footer-di1">
              <el-row>
                <el-col :span="12" class="foot-wei2">
                  <img src="https://bianke.cnki.net/resources/images/header-and-footer/hf11.gif" alt="" width="70px" height="70px">
                </el-col>
                <el-col :span="12" class="foot-wei1">
                  <div class="foot-wei">
                    <h4>官方微信</h4>
                    <span>扫描二维码</span>
                    <span>轻松关注</span>
                  </div>
                </el-col>
              </el-row>
              <el-row>
                <el-col :span="12" class="sina2">
                  <img src="../assets/platForm8-sina.gif" alt="">

                </el-col>
                <el-col :span="12" class="sina">
                  <div >
                    <p>新浪微博</p>
                    <em class="care">立即关注</em>
<!--                    <p class="care"></p>-->
                  </div>
                </el-col>

              </el-row>
            </div>
          </el-col>

        </el-row>

<!--          <div class="foot-textfo">

          </div>-->
          <i class="foot-textfo">
            数字出版：《中国学术期刊（光盘版）》电子杂志社有限公司

            京ICP证040431号 网络出版服务许可证(总)网出证(京)字第271号 京公网安备11010802020460号
          </i>
          <img src="https://bianke.cnki.net/resources/images/header-and-footer/hf-ba1.gif" alt="" class="foot-img">
        </div>

      </el-footer>
    </el-container>

  </div>
</template>

<script>
export default {
  name: "Button",
  data(){
    return{
      img: [
        'https://bianke.cnki.net/resources/imagesTemp/platForm/index-pic180527.jpg',
        'https://bianke.cnki.net/resources/imagesTemp/platForm/index-pic2021102803.jpg',
        'https://bianke.cnki.net/resources/imagesTemp/platForm/index-pic2021102801.jpg'
      ]
    }
  }
}
</script>

<style scoped>
  /*scoped这个属性让css样式只作用于此页面*/

/*.row1 {
  background-image: url("../assets/hf3-headerBg.gif");
  background-repeat: repeat;
  height: 54px;
}
.row3 {
  background-color: aqua;
}*/

.main-impt, .my-top{
/*  position: absolute;
  padding: 0px;
  margin: 0px;
  width: 100%;*/
  width: 100%;
  height: 100%;
  padding: 0;
  margin: 0;
}
.top-img {
  background-image: url("../assets/hf12-logo3.jpg");
  background-repeat: no-repeat;
  height: 25px;
  position: absolute;
  margin-left: 350px;
  width: 177px;
  margin-top: 16px;
}
.top-2 {
/*  position: absolute;*/


  padding-left: 600px;
  margin-top: 15px;
}
.top-2-2 {
  /*position: absolute;*/

  background-color: rgb(102,102,102);
  width: 400px;
  border-radius: 15px;
}
.search-img {
  background-image: url("../assets/hf5-searchIcon.gif");
  height: 30px;
  background-repeat: no-repeat;
  position: relative;
}
.my-menu {
  background-color: rgb(102,102,102);
  color: rgb(241,235,222);
}
.search-kung {
  background-color: rgb(198, 167, 85);
  height: 30px;
  border-radius: 0px 15px 15px  0px;
  color: white;

  font-size: 14px;
}
.search-kung:hover {
  background-color: rgb(215, 192, 114);
}
.search-kung span {
  margin-left: 12px;
 margin-top: 5px;
  display: block;
}
.menu-title {
                             color: rgb(241,235,222);
}
.menu-title:hover {
  color: black;
  background-color: rgb(241,235,222);
}
.el-dropdown-link {
  cursor: pointer;
  color: rgb(153,153,153);
}
.my-menu-down {
  margin-top: 4px;
}
.top-nav {
  position: absolute;
  width: 700px;
  margin-left: 1100px;
}
.top-nav-2 {
  background-color: black;
  /*color: rgb(150, 162, 167);*/

}
.mine {
  color: rgb(150, 162, 167);
}
.el-menu-item {
  color: rgb(150, 162, 167);
  /*padding-left: 0px;*/

}
.my-menu-it:hover {
  color: white;
}

.el-header {
  background-image: url("../assets/hf3-headerBg.gif");
  background-repeat: repeat;
  height: 54px;

 /* position: relative;*/
}
.el-footer {
/*  background-color: #B3C0D1;
  color: #333;
  text-align: center;
  line-height: 60px;*/
}
/*第一个main*/
.e-m-1 {
  background: url("../assets/dcjt_banner.jpg") no-repeat center;
  height: 501px;
  position: relative;
}
.zou {
  height: 450px;
  width: 100%;
}
.block-1 {
  background-color: #42b983;
  height: 450px;
}

.e-m-1-bt {
  width: 180px;
  height: 60px;
  margin-top: 352px;

  border-radius: 8px;
  color: #fdfdfd;
  position: absolute;

  margin-left: -100px;
 /* background: -moz-linear-gradient(top, #da4e4e 0%, #2c41a6 100%);*/
  background-color: rgb(251, 146, 28);
}

.e-m-2 {
  background: url("../assets/dcjt_bg1.jpg") no-repeat center;
  height: 629px;
  text-align: center;
  /*position: relative;*/
}
.e-m-22 {
  margin-left: 120px;
}
.e-m-2-2 {
/*  position: absolute;
  width: 1500px;*/
  width: 1500px;
  position: relative;

  margin-left: 100px;

}
.e-m-2-2-col {
/*  width: 200px;
  padding-left: 70px;
  height: 350px;*/
  /*position: absolute;*/





  height: 400px;

}
.e-m-2-2-col .e-m2-div{

  margin-top: 30px;
  border: solid 1px rgb(233,232,232);
  width: 280px;
  margin-left: 85px;
  height: 400px;
}
.e-m2-div-1 {
  height: 50%;
  background-color: rgb(246, 255, 244);
}
.e-m2-div-1 img {
  height: 95px;
  margin-top: 45px;
}
.e-m2-div-1 span {
  display: block;
  margin-top: 20px;

}
.e-m2-div-1 span em {
  font-size: 18px;
  font-style: normal;
  color: rgb(105,105,105);
  margin-top: 43px;
  display: block;
}
.e-m2-div-2 {
  height: 50%;
  background-color: rgb(255, 255, 255);
  border-top: 1px rgb(228,244,225) solid;
}
.e-m2-div-2 span {
  display: block;
  padding-top: 40px;
}
.e-m2-div-2 span em {
  display: block;
  font-style: normal;
  font-size: 20px;
  background-color: rgb(113, 200, 99);
  color: white;
  line-height: 42px;
  width: 220px;
  margin-top: 20px;
  border-radius: 6px ;
  margin-left: 29px;
  height: 42px;
}
.e-m2-div-2 p {
  color: rgb(105,105,105);
  font-size: 14px;
  text-align: left;
  display: block;
  width: 220px;
  margin-left: 32px;
  padding-left: 2px;
  line-height: 25px;

}
.content-2 .e-m2-div-1{
  background-color: rgb(245, 250, 255);
  border-top: 1px rgb(225,239,250) solid;
}
.content-2 .e-m2-div-2 span em {
  background-color: rgb(98, 171, 233);
}
.content-3 .e-m2-div-1{
  background-color: rgb(252, 246, 243);
  border-top: 1px rgb(255,232,219) solid;
}
.content-3 .e-m2-div-2 span em {
  background-color: rgb(255, 134, 72);
}
.content-4 .e-m2-div-1{
  background-color: rgb(251, 247, 255);
  border-top: 1px rgb(245,237,250) solid;
}
.content-4 .e-m2-div-2 span em {
  background-color: rgb(196, 145, 232);
}
.e-m-2 h3 {
  font-size: 55px;
  margin-top: 14px;
}
.e-m-2 span {
  font-size: 22px;
  display: block;
  margin-top: -30px;
}
.e-m-row {
 text-align: center;
}
.e-m-row .e-m-img img {
  margin-left: 100px;
}
.e-m-row .e-m-text h1 {
  font-size: 45px;
  padding-right: 420px;
  margin-top: 120px;
  font-weight: normal;
  display: block;
}
.e-m-row .e-m-text p{
  display: block;
  width: 400px;
  margin-top: -20px;
  line-height: 30px;
  margin-left: 50px;
  text-align: left;
}
.e-m-4 {
  background-color: rgb(98, 186, 226);
}

/*.e-m-3 {
  margin-top: 100px;
}*/
/*.e-m-4 .e-m-img {

}*/
.e-m-4 .e-m-img img{
  padding-right: 400px;
}
.e-m-4 .e-m-row .e-m-text {
  position: relative;

}
.e-m-4 .e-m-row .e-m-text .e-m-h1 {


  color: white;
  position: relative;
  width: 600px;
  margin-left: 260px;
}
.e-m-4 .e-m-row .e-m-text .e-m-h1 h1 {
  width: 600px;
}
.e-m-4 .e-m-row .e-m-text .e-m-h1 p {
  display: block;
  padding-left: 52px;
}
.e-m-5 {
  background-color: white;
}
.e-m-5 div {
  text-align: center;
}
.e-m-5 div img {
  margin-right: 200px;
  margin-top: -20px;
}
.e-m-5 div h1 {
  font-size: 45px;
  display: block;
  font-weight: normal;
  margin-top: 140px;
  margin-left: 200px;
}
.e-m-5 div p {
  line-height: 30px;
  display: block;
  margin-left: 220px;
}
.e-m-6 {
  background-color: rgb(254, 198, 22);
  text-align: center;
}
.e-m-6 div img {
  margin-left: 200px;
}
.e-m-6 div h1 {
  font-size: 45px;
  display: block;
  margin-right: 250px;
  font-weight: normal;
  margin-top: 140px;
}
.e-m-6 div p {
  display: block;
  width: 400px;
  text-align: left;
  margin-left: 140px;
}

.e-m-7 {
  width: 1500px;
  margin: 0px auto;
  margin-top: 30px;
  text-align: center;
}
.e-m-7 span {
  font-size: 35px;
  font-weight: 500;
  margin-top: 20px;
}

.e-m-7 .m7-di1:hover {
  background-color: rgb(245, 228, 221);
  border: 1px solid rgb(236, 127, 85);
}
.e-m-7 .m7-di1 {
  position: relative;
  margin-right: 20px;
  border: 1px solid rgb(237, 237, 237);
}
.e-m-7 .m7-di1 h4 {
  display: block;
  margin-top: 10px;
  margin-right: 0px;
}
.e-m-7 .m7-di1 p {
  display: block;
  margin-top: -15px;
  font-size: 15px;
  margin-right: 220px;
}
.e-m-7-row2 {
  margin-top: 25px;
}
.e-m-7 .m7-di1 img {
  padding-top: 20px;
}

.e-m-7 el-col {
  background-color: #42b983;
}
.e-m-7 .e-m-7-text {
  padding-bottom: 40px;
  display: block;
}
.e-m-7 .m7-di1 span {
  margin-top: 40px;
  margin-left: 210px;
  display: block;
  position: absolute;
  height: 30px;
  width: 80px;
  line-height: 30px;
  border-radius: 20px;
  font-size: 13px;
  color: white;
  background-color: rgba(23, 22, 22, 0.6);

}
.e-m-7 .e-m-7-text2 {

  display: block;
  border-radius: 30px;
  height: 50px;
  line-height: 50px;
  font-size: 25px;
  margin: 70px auto;
  width: 250px;
  color: white;
  background-color: rgb(251, 183, 86);
}

.el-main {
/*  background-color: #E9EEF3;
  color: #333;*/
 /* text-align: center;*/

}
.footer {
  background-color: rgb(68, 68, 68);
 /* height: 280px;*/
  height: 350px;
}
.footer .footer-row {

 /* background-color: #42b983;*/
/*  margin: 10px auto;*/
  margin-left: 300px;
  height: 200px;
  width: 1500px;
}
.footer .footer-row .footer-di1 {
/*  border: 1px solid black;*/
  height: 170px;

  background-color: rgb(87, 87, 87);
  width: 200px;
  padding-left: 45px;
}
.footer .footer-row .footer-di1 span {
  display: block;
  font-size: 18px;
  color: white;
  padding-top: 20px;
  padding-bottom: 10px;
}
.footer .footer-row el-col {
/*  margin-left: 20px;*/
}
.footer .footer-row .footer-di1 img {
  padding-top: 20px;
}
.footer .footer-row .footer-di1 .foot-wei2 {

  width: 88px;
}
.footer .footer-row .footer-di1 .foot-wei1 {


}
.footer .footer-row .footer-di1 .foot-wei {

}
.footer .footer-row .footer-di1 .foot-wei h4{
  color: white;
  font-weight: normal;
  margin-top: 22px;
  padding-right: 20px;
  display: block;
}
.footer .footer-row .footer-di1 .foot-wei span {
  display: block;
  font-size: 12px;
  margin-top: -30px;
}
.footer .footer-row .footer-di1 pre {
  display: block;
  color: white;
  font-size: 9px;
  background-color: black;
  padding-right: 100px;
  width: 140px;
}
.sina2 {
  width: 45px;
}
/*.sina span{
  display: block;
  font-size: 10px;
}*/
.sina {

  width: 170px;
  margin-left: 50px;
  height: 200px;
}
.sina .care {
  display: block;
  margin-left: 80px;
  margin-top: -27px;
  font-size: 13px;
  background-color: #fdfdfd;
  color: black;
  height: 20px;
  line-height: 20px;
  width: 55px;
  font-style: normal;
}
.sina p{
  font-size: 20px;
  display: block;
  margin-top: -24px;

}
.footer .footer-row .footer-di1 P{
  display: block;
  color: white;
  line-height: 20px;
  font-size: 8px;
}
.foot-textfo {
  margin-top: 20px;
  text-align: center;
  font-weight: normal;
  position: absolute;
  height: 100px;
  display: block;
  margin-left: 700px;
  width: 500px;
  padding-top: -100px;
  font-style: normal;
  color: #fdfdfd;
  font-size: 14px;
  line-height: 30px;
}
.foot-img {
  margin-left: 1400px;
  margin-top: 30px;
  position: absolute;
  display: block;
}
</style>
